<template></template>

<script setup>
import { useMessage } from 'naive-ui';

const NMessage = useMessage();

let loadingMessage = null;

class Message {
  removeMessage() {
    if (loadingMessage) {
      loadingMessage.destroy();
      loadingMessage = null;
    }
  }

  showMessage(type, content, option = {}) {
    if (loadingMessage) {
      loadingMessage.destroy();
      loadingMessage = null;
    }
    loadingMessage = NMessage[type](content, { ...option, duration: option.duration !== undefined ? option.duration : 1500 });
  }

  loading(content) {
    this.showMessage('loading', content, { duration: 0 });
  }

  success(content, callback = () => {}) {
    this.showMessage('success', content, {
      onLeave: () => {
        callback();
      }
    });
  }

  error(content, callback = () => {}) {
    this.showMessage('error', content, {
      onLeave: () => {
        callback();
      }
    });
  }

  info(content, callback) {
    this.showMessage('info', content, {
      onAfterLeave: () => {
        callback && callback();
      }
    });
  }

  warning(content, callback) {
    this.showMessage('warning', content, {
      onAfterLeave: () => {
        callback && callback();
      }
    });
  }
}

window['$uiMsg'] = new Message();
</script>